<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ page isELIgnored="false"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%@ include file="/WEB-INF/pages/common/inc.jsp"%>
<link
	href="${ctxStatic}/css/plugins/blueimp/css/blueimp-gallery.min.css"
	rel="stylesheet">
<link href="${ctxStatic}/css/plugins/summernote/summernote.css"
	rel="stylesheet">
<link href="${ctxStatic}/css/plugins/summernote/summernote-bs3.css"
	rel="stylesheet">
<link href="${ctxStatic}/css/plugins/dropzone/dropzone.css"
	rel="stylesheet">
<style>
.lightBoxGallery img {
	margin: 5px;
	width: 160px;
}
</style>
<body class="gray-bg" style="cursor: auto;">
	<div class="wrapper wrapper-content">
		<form action="${ctx}/admin/goods/editGoods" method="POST" id="pubForm"
			class="form-horizontal m-t">
		<input type="hidden" value="" name="goods.pics" id="pics">
		<input type="hidden" value="${goods.id}" name="goods.id">
		<input type="hidden" value="" name="goods.description" id="description">
			<div class="ibox float-e-margins">
				<div class="ibox-title">
					<h5>产品规格</h5>
					<div class="ibox-tools">
						<a class="collapse-link"> <i class="fa fa-chevron-up"></i>
						</a> <a class="dropdown-toggle" data-toggle="dropdown"
							href="form_editors.html#"> <i class="fa fa-wrench"></i>
						</a> <a class="close-link"> <i class="fa fa-times"></i>
						</a>
					</div>
				</div>
				<div class="ibox-content no-padding">
					<table class="table">
						<tbody>
							<tr>
								<td>商品名</td>
								<td><input type="text" name="goods.name" value="${goods.name}" class="form-control"
									placeholder="请输入文本" required="required"></td>
								<td>类型</td>
								<td><select class="form-control" name="goods.type">
										<c:forEach items="${fns:getDictList('test')}" var="dict">
											<c:if test="${dict.value == goods.type}">
												<option value="${dict.value}" selected="selected">${dict.label}</option>
											</c:if>
											<c:if test="${dict.value != goods.type}">
												<option value="${dict.value}">${dict.label}</option>
											</c:if>
										</c:forEach>
								</select></td>
							</tr>
							<tr>
								<td>长度</td>
								<td><input type="number" name="goods.length" value="${goods.length }" class="form-control"
									placeholder="单位mm" required="required"></td>
								<td>宽度</td>
								<td><input type="number" name="goods.width" value="${goods.width}" class="form-control"
									placeholder="单位mm" required="required"></td>
							</tr>
							<tr>
								<td>高度</td>
								<td><input type="number" name="goods.height" value="${goods.height}" class="form-control"
									placeholder="单位mm" required="required"></td>
								<td>重量</td>
								<td><input type="number" name="goods.weight" value="${goods.weight}" class="form-control"
									placeholder="单位kg" required="required"></td>
							</tr>
							<tr>
								<td>功率</td>
								<td><input type="number" name="goods.power" value="${goods.power}" class="form-control"
									placeholder="单位KW" required="required"></td>
									<shiro:hasRole name="admin">
									<td>排序</td>
									<td><input type="number" name="goods.sort" value="${goods.sort}" class="form-control"
									placeholder="数值越大排序在前" required="required"></td>
									</shiro:hasRole>
							</tr>
						</tbody>
					</table>
				</div>
			</div>
		<div class="row">
			<div class="col-sm-12">
				<div class="ibox float-e-margins">
					<div class="ibox-title">
						<h5>上传图片</h5>
						<div class="ibox-tools">
							<a class="collapse-link"> <i class="fa fa-chevron-up"></i>
							</a> <a class="dropdown-toggle" data-toggle="dropdown" href="#">
								<i class="fa fa-wrench"></i>
							</a>
							<ul class="dropdown-menu dropdown-user">
							</ul>
							<a class="close-link"> <i class="fa fa-times"></i>
							</a>
						</div>
					</div>
					<div class="ibox-content">
						<div id="my-awesome-dropzone" class="dropzone">
							<div align="right">
								<button class="btn btn-success " type="button" id="sub">
									<i class="fa fa-upload"></i>&nbsp;&nbsp;<span class="bold">上传</span>
							</div>
							</button>
						</div>
						<div>
							<h3>已发布管理</h3>
							<p>点击图片查看大图,可左右切换</p>
							<div class="lightBoxGallery">
								<div id="images"></div>
								<div id="blueimp-gallery" class="blueimp-gallery">
									<div class="slides"></div>
									<h3 class="title"></h3>
									<a class="prev"><</a> <a class="next">></a> <a class="close">×</a>
									<a class="play-pause"></a>
									<ol class="indicator"></ol>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
		<div class="row">
				<div class="col-sm-12">
					<div class="ibox float-e-margins">
						<div class="ibox-title">
							<h5>商品描述</h5>
							<div class="ibox-tools">
								<a class="collapse-link"> <i class="fa fa-chevron-up"></i>
								</a> <a class="dropdown-toggle" data-toggle="dropdown"
									href="form_editors.html#"> <i class="fa fa-wrench"></i>
								</a> <a class="close-link"> <i class="fa fa-times"></i>
								</a>
							</div>
						</div>
						<div class="ibox-content no-padding">
							<script id="container" name="goods.description" type="text/plain">${goods.description}</script>
						</div>
					</div>
				</div>
			</div>
			<!-- 鼠标移动上面就获取summernote 中的code -->
			<div align="center">
				<button type="submit" class="btn btn-primary" onclick="getLocalData()">发布</button>
				<button type="submit" class="btn btn-success">预览</button>
			</div>
			</form>
		</div>
		<script src="${ctxStatic}/js/jquery.min.js?v=2.1.4"></script>
		<script src="${ctxStatic}/js/bootstrap.min.js?v=3.3.6"></script>
		<script src="${ctxStatic}/js/content.min.js?v=1.0.0"></script>
		<script
			src="${ctxStatic}/js/plugins/blueimp/jquery.blueimp-gallery.min.js"></script>
		<script src="${ctxStatic}/js/plugins/webuploader/webuploader.min.js"></script>
		<script src="${ctxStatic}/js/plugins/dropzone/dropzone.js"></script>
		<script src="${ctxStatic}/js/plugins/dropzone/dropzoneconfig.js"></script>
		<script type="text/javascript">
		function getCtxPath() {
			return "${ctx}";
		}
		</script>
		<script type="text/javascript" src="${ctxStatic}/js/plugins/ueditor/ueditor.config.js"></script>
		<script type="text/javascript" src="${ctxStatic}/js/plugins/ueditor/ueditor.all.js"></script>
		<script>
			$(function() {
				getImages();
			});
			var ue = UE.getEditor('container');
			  function getLocalData () {
				 var text = ue.execCommand( "getlocaldata" );
				$("#description").val(text);
			  };
			
			function delPic(key) {
				$.get("${ctx}/admin/goods/delImage?key=" + key+ "&id=${goods.id}", function() {
					getImages();
				});
			}

			function getImages() {
				$.get("${ctx}/admin/goods/getImages/${goods.id}",
						function(images) {
							$("#images").empty();
							$.each(images,function(i, n) {
								$("#images").append("<a href='${qiniu}/"+i+"' title='图片' data-gallery=''> <img src='${qiniu}/"+i+"'></a>");
								$("#images").append("<a href='#' onclick=delPic('"+ i+ "') class='fa fa-remove'></a>");
						});
					})
			}
		</script>
</body>
